const LOCAL_NANE = '_dark_mode_theme_'
const rememberedValue = localStorage.getItem(LOCAL_NANE)

if (rememberedValue && ['light', 'dark'].includes(rememberedValue)) {
    document.documentElement.setAttribute('data-color-mode', rememberedValue)
    const iframe = document.querySelector('.giscus-frame')
    if (iframe) {
        const config = {
            setConfig: {
                theme: rememberedValue.toLocaleLowerCase(),
            },
        }
        iframe.contentWindow.postMessage({giscus: config}, 'https://giscus.app')
    }
}
const button = document.querySelector('#darkMode')
button.onclick = () => {
    const theme = document.documentElement.dataset.colorMode
    const mode = theme === 'light' ? 'dark' : 'light'
    document.documentElement.setAttribute('data-color-mode', mode)
    localStorage.setItem(LOCAL_NANE, mode)
    const iframe = document.querySelector('.giscus-frame')
    if (iframe) {
        const config = {
            setConfig: {theme: mode},
        }
        iframe.contentWindow.postMessage({giscus: config}, 'https://giscus.app')
    }
}
